import 'package:flutter/material.dart';
import 'package:znmm/config/app_color.dart';

class ProfilePage extends StatelessWidget {
  const ProfilePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      color: AppColor.backgroundColor,
      child: Column(
        children: [
          Stack(
            children: [
              // 半圆背景
              Positioned(
                top: -200,
                left: -50,
                right: -50,
                child: Container(
                  height: 380,
                  decoration: BoxDecoration(
                    color: const Color(0xFFFF7043), // 橙色背景
                    borderRadius: BorderRadius.circular(100),
                  ),
                ),
              ),

              const Positioned(
                top: 50,
                right: 30,
                child: Icon(Icons.settings, color: Colors.white),
              ),
              // 主内容
              Column(
                children: [
                  const SizedBox(height: 80), // 顶部留白
                  _buildHeaderCard(),
                  const SizedBox(height: 16),
                  _buildMembershipSection(),
                  const SizedBox(height: 16),
                  const Padding(
                    padding: EdgeInsets.symmetric(horizontal: 16.0),
                    child: Text(
                      "跳转至PC端解锁更多功能：https://saas.upkuajing.com/login",
                      style: TextStyle(
                        fontSize: 12,
                        color: Colors.grey,
                      ),
                      textAlign: TextAlign.center,
                    ),
                  ),
                  const SizedBox(height: 16),
                ],
              ),
            ],
          ),
          Expanded(child: _buildMenuList(context)),
          const SizedBox(
            height: 10,
          )
        ],
      ),
    );
  }

  Widget _buildHeaderCard() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16.0),
      padding: const EdgeInsets.all(16.0),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(16.0),
        boxShadow: [
          BoxShadow(
            color: Colors.black.withOpacity(0.1),
            blurRadius: 8,
            offset: const Offset(0, 4),
          ),
        ],
      ),
      child: Column(
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
            children: [
              const Row(
                children: [
                  Icon(
                    Icons.account_circle,
                    size: 40,
                    color: Colors.grey,
                  ),
                  SizedBox(width: 8),
                  Text(
                    '13430211830',
                    style: TextStyle(
                      fontSize: 18,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                ],
              ),
              Container(
                padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
                decoration: BoxDecoration(
                  color: const Color(0xFFFFF3E0),
                  borderRadius: BorderRadius.circular(12),
                ),
                child: const Text(
                  '体验版',
                  style: TextStyle(
                    fontSize: 12,
                    color: Color(0xFFFF7043),
                  ),
                ),
              ),
            ],
          ),
          const SizedBox(height: 16),
          const Divider(),
          const SizedBox(height: 16),
          const Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: [
              _HeaderItem(label: '账户余额(元)', value: '0'),
              _HeaderItem(label: '搜索记录', value: '1'),
              _HeaderItem(label: '客户管理', value: '0'),
            ],
          ),
        ],
      ),
    );
  }

  Widget _buildMembershipSection() {
    return Container(
      margin: const EdgeInsets.symmetric(horizontal: 16.0),
      padding: const EdgeInsets.all(16.0),
      decoration: BoxDecoration(
        color: const Color(0xFFFFF3E0),
        borderRadius: BorderRadius.circular(16.0),
      ),
      child: Row(
        children: [
          const Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: [
                Text(
                  '跨境魔方体验版',
                  style: TextStyle(
                    fontSize: 16,
                    fontWeight: FontWeight.bold,
                  ),
                ),
                SizedBox(height: 8),
                Text(
                  '开通会员即可享受全部功能免费',
                  style: TextStyle(
                    fontSize: 14,
                    color: Colors.grey,
                  ),
                ),
              ],
            ),
          ),
          ElevatedButton(
            style: ElevatedButton.styleFrom(
              backgroundColor: const Color(0xFF795548), // 按钮深棕色背景
              shape: RoundedRectangleBorder(
                borderRadius: BorderRadius.circular(20),
              ),
            ),
            onPressed: () {},
            child: const Text('开通会员'),
          ),
        ],
      ),
    );
  }

  Widget _buildMenuList(BuildContext context) {
    final List<Map<String, String>> menuItems = [
      {'icon': 'share', 'label': '分享产品', 'subtitle': '分享得更多奖励'},
      {'icon': 'star', 'label': '我的收藏'},
      {'icon': 'mail', 'label': '我的邀请', 'subtitle': '查看邀请和收益记录'},
      {'icon': 'group', 'label': '成员管理'},
      {'icon': 'exit_to_app', 'label': '导出记录'},
      {'icon': 'school', 'label': '商学院'},
      {'icon': 'contacts', 'label': '通讯录'},
    ];

    return MediaQuery.removePadding(
        removeTop: true,
        context: context,
        child: ListView.builder(
          // physics: const NeverScrollableScrollPhysics(),
          shrinkWrap: true,
          itemCount: menuItems.length,
          itemBuilder: (context, index) {
            final item = menuItems[index];
            return ListTile(
              leading: Icon(
                _getIcon(item['icon']!),
                color: AppColor.black,
              ),
              title: Text(item['label']!),
              subtitle:
                  item['subtitle'] != null ? Text(item['subtitle']!) : null,
              trailing: const Icon(Icons.chevron_right),
              onTap: () {},
            );
          },
        ));
  }

  IconData _getIcon(String iconName) {
    switch (iconName) {
      case 'share':
        return Icons.share;
      case 'star':
        return Icons.star;
      case 'mail':
        return Icons.mail;
      case 'group':
        return Icons.group;
      case 'exit_to_app':
        return Icons.exit_to_app;
      case 'school':
        return Icons.school;
      case 'contacts':
        return Icons.contacts;
      default:
        return Icons.help_outline;
    }
  }
}

class _HeaderItem extends StatelessWidget {
  final String label;
  final String value;

  const _HeaderItem({required this.label, required this.value});

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(
          value,
          style: const TextStyle(
            fontSize: 18,
            fontWeight: FontWeight.bold,
          ),
        ),
        const SizedBox(height: 4),
        Text(
          label,
          style: const TextStyle(
            fontSize: 14,
            color: Colors.grey,
          ),
        ),
      ],
    );
  }
}
